<template>
  <div class="container">
    <div class="text-content">
      <img src="../../assets/imgs/image2.png" alt="" />
      <p class="text">抖音号：<span>xiyuan84841244</span></p>
      <p class="text">联系电话：<span>84841244/84847999/84802855</span></p>
      <img src="../../assets/imgs/image1.png" alt="" />
      <img src="../../assets/imgs/image3.jpg" alt="" />

      <div class="location-btn">
        <van-button type="primary" @click="openLocation">查看路线</van-button>
      </div>
    </div>
  </div>
</template>

<script>
import wx from "weixin-jsapi";
import { wxSignatureVerification } from "@/api/wx";
export default {
  data() {
    return {
      latitude: "",
      longitude: "",
    };
  },

  created() {
    this.getWxConfig();
  },
  methods: {
    getWxConfig() {
        console.log("获取微信配置信息")
      let that = this;
      let params = {
        url: location.href.split("#")[0],
      };
      wxSignatureVerification(params).then((res) => {
        if (res.code != "2000") return Toast.fail("微信验签失败");
        let result = res.data.wxConfig;
        wx.config({
          debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
          appId: res.data.appId, // 必填，公众号的唯一标识
          timestamp: result.timestamp, // 必填，生成签名的时间戳
          nonceStr: result.nonceStr, // 必填，生成签名的随机串
          signature: result.signature, // 必填，签名
          jsApiList: ["getLocation", "openLocation"],
        });
        wx.ready(function () {
            console.log("111")
          wx.getLocation({
            type: "wgs84", // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
            success: function (res) {
              console.log(res);
              var latitude = res.latitude; // 纬度，浮点数，范围为90 ~ -90
              var longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。
              var speed = res.speed; // 速度，以米/每秒计
              var accuracy = res.accuracy; // 位置精度
              that.latitude = latitude;
              that.longitude = longitude;
            },
          });
        });
        wx.error(function (res) {
          alert("微信验证失败");
        });
      });
    },
    openLocation() {
      wx.openLocation({
        latitude: 43.908591, // 纬度，浮点数，范围为90 ~ -90
        longitude: 125.425898, // 经度，浮点数，范围为180 ~ -180。
        name: "", // 位置名
        address: "", // 地址详情说明
        scale: 16, // 地图缩放级别,整型值,范围从1~28。默认为最大
        infoUrl: "", // 在查看位置界面底部显示的超链接,可点击跳转
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.container {
  padding: 15px;
  line-height: 1.5;
  .text{
      font-size: 16px;
    span{
        color: cornflowerblue;
    }
  }
  img {
    padding-top: 10px;
    width: 100%;
  }
  .location-btn {
    padding-top: 15px;
  }
}
</style>